/*
 * @Author: Setsuna
 * @Email: setsuna.xyz@qq.com
 * @FilePath: \src\pages\CustomerManage\PrizeCashing\Prize\index.tsx
 * @Date: 2022-12-05 11:52:37
 * @LastEditTime: 2023-02-16 19:11:02
 * @LastEditors: Setsuna
 */

import React from 'react'
import {
  BaseListPage,
  IBaseListPageProps,
  IBaseListPageState,
  http,
  columnRenders,
  UdDrawer,
  UdDateRangePicker,
} from '@/lib'
import { Modal, message, Select, Button, Spin } from 'antd'
import UdSelect from '@/components/UdFormControls/UdSelect'
import PrizeDetails from '../component/PrizeDetails'
import apis from '@/apis/CustomerManage'
import udMainStore from '@/store/UdMain'
import { downBlobFile } from '@/utils/methods'
const { Option } = Select

export default class profitReporting extends BaseListPage<IProps, IState> {
  protected useConditionsField = true
  public brandList = udMainStore.brandList
  constructor(props: IProps) {
    super(props)
    this.state = {
      uploading: false,
      downloading: false,
      rowKey: 'id',
      title: '奖品兑付',
      queryApi: apis.getPrizeWipedRecordPage,
      method: 'POST',
      conditions: [
        {
          label: '品牌公司',
          id: 'brandCode',
          initialValue: this.brandList[0].value,
          render: <UdSelect showSearch allowClear={false} options={this.brandList} />,
        },
        {
          id: 'agentType',
          label: '客户类型',
          initialValue: 1,
          value: '',
          render: () => (
            <Select>
              <Option value={1}>经销商</Option>
              <Option value={2}>分销商</Option>
            </Select>
          ),
        },
        {
          id: 'status',
          label: '状态',
          render: () => (
            <Select>
              <Option value={0}>待确认</Option>
              <Option value={1}>已确认</Option>
              <Option value={2}>已失效</Option>
            </Select>
          ),
        },
        {
          id: ['createTimeStart', 'createTimeEnd'],
          label: '发起时间起止',
          render: () => <UdDateRangePicker valueFormat={['YYYY-MM-DD 00:00:00', 'YYYY-MM-DD 23:59:59']} />,
        },
        {
          id: ['statusTimeStart', 'statusTimeEnd'],
          label: '确认时间起止',
          render: () => <UdDateRangePicker valueFormat={['YYYY-MM-DD 00:00:00', 'YYYY-MM-DD 23:59:59']} />,
        },
        {
          id: 'acctName',
          label: '下级客户名称',
        },
        {
          id: 'acctCode',
          label: '下级客户编码',
        },
        { label: '经销商名称', id: 'dealerName' },
        { label: '经销商编码', id: 'dealerCode' },
        { label: '分销商名称', id: 'acctName' },
        { label: '分销商编码', id: 'acctCode' },
      ],
      columns: [
        {
          title: '序号',
          key: 'description',
          dataIndex: 'description',
          width: 50,
          render: (text, record, index) => {
            return index + 1
          },
        },
        { title: '品牌公司名称', dataIndex: 'brandName', key: 'brandName', minWidth: '200px' },
        {
          title: '客户类型',
          dataIndex: 'agentType',
          key: 'agentType',
          minWidth: '80px',
          render: (text, record, index) => {
            if (text === 1) {
              return '经销商'
            } else {
              return '分销商'
            }
          },
        },
        { title: '客户名称', dataIndex: 'dealerName', key: 'dealerName', minWidth: '200px' },
        {
          title: '下级客户类型',
          dataIndex: 'acctType',
          key: 'acctType',
          minWidth: '80px',
          render: (text, record, index) => {
            if (text === 0) {
              return '分销商'
            } else {
              return '终端'
            }
          },
        },
        { title: '下级客户名称', dataIndex: 'acctName', key: 'acctName', minWidth: '150px' },
        { title: '发起时间', dataIndex: 'createTime', key: 'createTime', minWidth: '150px' },
        { title: '确认时间', dataIndex: 'statusTime', key: 'statusTime', minWidth: '150px' },
        {
          title: '同步企微订单系统是否成功',
          dataIndex: 'isQw',
          key: 'isQw',
          fixedWidth: '200px',
          render: (text, record, index) => {
            if (text === 0) {
              return '成功'
            } else {
              return '未成功'
            }
          },
        },
        {
          title: '同步终端订单系统是否成功',
          dataIndex: 'isZd',
          key: 'isZd',
          fixedWidth: '200px',
          render: (text, record, index) => {
            if (record.acctType==1) {
              if (text === 0) {
                return '成功'
              } else {
                return '未成功'
              }
            } else {
              return '-'
            }
          },
        },
        {
          title: '状态',
          dataIndex: 'status',
          key: 'status',
          fixedWidth: '80px',
          render: (text, record, index) => {
            if (text === 0) {
              return '待确认'
            } else if (text === 1) {
              return '已确认'
            } else {
              return ' 已失效'
            }
          },
        },
        {
          dataIndex: 'action',
          title: '操作',
          fixedWidth: '120px',
          fixed: 'right',
          render: columnRenders.operate([
            {
              title: '查看详情',
              action: (text, record) => this.handPrizeDetails(record),
            },
          ]),
        },
      ],
      tableProps: {
        rowSelection: null,
        scroll: { x: true },
      },
      leftBtns: [
        <Button type="primary" onClick={this.handDownloadExcel}>
          导出
        </Button>,
      ],
    }
  }

  private handDownloadExcel = () => {
    this.setState({ downloading: true })
    let params = this.filterForm.getFieldsValue()
    let brandName = this.brandList.find(item => {
      return item.value === params.brandCode
    })?.title
    http
      .post(apis.downloadPrizeWipedRecordExcel, { ...params }, { responseType: 'arraybuffer' })
      .then(res => {
        if (!res.data.code) {
          downBlobFile(res.data, `${brandName}-兑换记录`)
        }
      })
      .finally(() => {
        this.setState({ downloading: false })
      })
  }

  private handPrizeDetails = (record: any) => {
    UdDrawer.open({
      title: '兑付详情',
      width: '50%',
      content: <PrizeDetails id={record.id} />,
      footer: false,
    })
  }

  private handPrizeDelete = (id: any) => {
    Modal.confirm({
      title: '删除兑付记录',
      content: '兑付记录删除后将无法恢复，是否继续？',
      okType: 'danger',
      onOk: () => {
        return http.delete(apis.deletePrize, { params: { id } }).then(res => {
          message.success('删除成功')
          this.query()
        })
      },
    })
  }
  componentDidMount() {
    super.componentDidMount()
  }

  render() {
    return (
      <Spin
        spinning={this.state.uploading || this.state.downloading}
        tip={this.state.uploading ? '上传中，请稍后...' : '请求中，请稍后...'}
      >
        {super.render()}
      </Spin>
    )
  }
}
interface IProps extends IBaseListPageProps {}

interface IState extends IBaseListPageState {
  uploading: boolean
  downloading: boolean
}
